<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title>旺财1号</title>
	<!-- <link rel="icon" href="../../imges/big_wc.ico" type="image/x-icon"/>  -->
	<link rel="icon" href="../../imges/logo.png" type="image/x-icon"/> 
	<script src="https://s3.pstatp.com/cdn/expire-1-M/jquery/3.1.1/jquery.min.js"></script>
	<script src="../bootStrap/js/bootstrap.min.js"></script>
	<link rel="stylesheet" type="text/css" href="../bootStrap/css/bootstrap.min.css" />
	<link rel="stylesheet" href="../css/my.css" />
</head>

<body>
	<div class=container>
		<button type="button" class="btn btn-success" onclick="fun()">123</button>

		<span class="glyphicon glyphicon-search" aria-hidden="true"></span>

		<button type="button" class="btn btn-default" aria-label="Left Align" class="btn">
			<span class="glyphicon glyphicon-align-left" aria-hidden="true"></span>
		</button>

		<div class="alert alert-danger" role="alert">
			<span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
			<span class="sr-only">Error:</span> Enter a valid email address
		</div>

		<div class="dropdown">
			<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown"
				aria-haspopup="true" aria-expanded="true">Dropdown
				<span class="caret"></span>
			</button>
			<ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
				<li>
					<a href="#">Action</a>
				</li>
				<li>
					<a href="#">Another action</a>
				</li>
			</ul>
		</div>

		<div class="btn-group btn-group-justified" role="group" aria-label="...">
			<div class="btn-group" role="group">
				<button type="button" class="btn btn-default">Left</button>
			</div>
			<div class="btn-group" role="group">
				<button type="button" class="btn btn-default">Middle</button>
			</div>
			<div class="btn-group" role="group">
				<button type="button" class="btn btn-default">Right</button>
			</div>
		</div>

		<!-- Single button -->
		<div class="btn-group">
			<button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown" aria-haspopup="true"
				aria-expanded="false">
				Action <span class="caret"></span>
			</button>
			<ul class="dropdown-menu">
				<li><a href="#">Action</a></li>
				<li><a href="#">Another action</a></li>
				<li><a href="#">Something else here</a></li>
				<li role="separator" class="divider"></li>
				<li><a href="#">Separated link</a></li>
			</ul>
		</div>

		<!-- Split button -->
		<div class="btn-group">
			<button type="button" class="btn btn-danger">Action</button>
			<button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown" aria-haspopup="true"
				aria-expanded="false">
				<span class="caret"></span>
				<span class="sr-only">Toggle Dropdown</span>
			</button>
			<ul class="dropdown-menu">
				<li style="display: flex;">
					<span class="glyphicon glyphicon-search" aria-hidden="true"
						style="margin:5px -15px 0px 20px;"></span>
					<a href="#">Action</a>
				</li>
				<li><a href="#">Another action</a></li>
				<li><a href="#">Something else here</a></li>
				<li role="separator" class="divider"></li>
				<li><a href="#">Separated link</a></li>
			</ul>
		</div>

		<div class="input-group">
			<span class="input-group-addon" id="basic-addon1">@</span>
			<input type="text" class="form-control" placeholder="Username" aria-describedby="basic-addon1">
		</div>

		<div class="input-group">
			<input type="text" class="form-control" placeholder="Recipient's username" aria-describedby="basic-addon2">
			<span class="input-group-addon" id="basic-addon2">@example.com</span>
		</div>

		<div class="input-group">
			<span class="input-group-addon">$</span>
			<input type="text" class="form-control" aria-label="Amount (to the nearest dollar)">
			<span class="input-group-addon">.00</span>
		</div>

		<label for="basic-url">Your vanity URL</label>
		<div class="input-group">
			<span class="input-group-addon" id="basic-addon3">https://example.com/users/</span>
			<input type="text" class="form-control" id="basic-url" aria-describedby="basic-addon3">
		</div>

		<div>
			<input type="checkbox" class="check-my" value="apple">苹果
			<input type="checkbox" class="check-my" value="orange">橘子
			<input type="checkbox" class="check-my" value="banana">香蕉
			<input type="checkbox" class="check-my" value="tomato">西红柿
		</div>
		<div>
			<button type="button" class="btn btn-success" id="getCheck" disabled>获取已勾选</button>
		</div>

	</div>

	<script type="text/javascript">
		$(() => {
			$('.check-my').change(() => {
				const arr = [];
				$('.check-my').each((index, el) => {
					if (el.checked) {
						arr.push(el.value);
					}
				})
				console.log(arr);
				if (arr.length > 0) {
					$('#getCheck').removeAttr('disabled');
				} else {
					$('#getCheck').attr("disabled",'disabled');
				}

			})

			$('#getCheck').on('click', () => {
				const arr = [];
				$('.check-my').each((index, el) => {
					if (el.checked) {
						arr.push(el.value);
					}

				})
				console.log(arr);

			})


		});

		function fun() {
			console.log(123);
		}
	</script>
</body>

</html>